<template>
  <div class="layout">
    <Row style="margin-top: 20px;">
      <Card shadow style='height:500px'>
        <div class='title'>个人中心</div>
        <i-form :model="formInline" :label-width="80" style='width:350px'>
            <Form-item prop="serialNumber" label="序列号:">
              <i-input type="text" :value.sync="formInline.serialNumber" placeholder="请输入序列号" disabled>
                <common-icon :size="16" type="_accessory" slot="prepend"/>
              </i-input>
            </Form-item>
            <Form-item prop="username" label="用户名:">
              <i-input type="text" :value.sync="formInline.username" placeholder="请输入用户名" disabled>
                <common-icon :size="16" type="_user" slot="prepend"/>
              </i-input>
            </Form-item>
            <Form-item prop="authorizeNum" label="授权数量:">
              <i-input type="text" :value.sync="formInline.authorizeNum" placeholder="请输入授权数量" disabled>
                <common-icon :size="16" type="_safetycertificate" slot="prepend"/>
              </i-input>
            </Form-item>
            <Form-item prop="messageNum" label="短信剩余:">
              <i-input type="text" :value.sync="formInline.messageNum" placeholder="请输入短信剩余数量" disabled>
                <common-icon :size="16" type="_mail" slot="prepend"/>
              </i-input>
            </Form-item>
        </i-form>
      </Card>
    </Row>
  </div>
</template>
<script>
import CommonIcon from '_c/common-icon'
export default {
  name: 'personal',
  components: {
    CommonIcon
  },
  data () {
    return {
       customIconList: [
        'user',
        'safetycertificate',
        'accessory',
        'mail'
      ],
      formInline: {
        serialNumber: '01677062224',
        username: '南京悟空',
        authorizeNum: '1',
        messageNum: '0'
      }
      // ruleInline: {
      //     user: [
      //         { required: true, message: '请填写用户名', trigger: 'blur' }
      //     ],
      //     password: [
      //         { required: true, message: '请填写密码', trigger: 'blur' },
      //         { type: 'string', min: 6, message: '密码长度不能小于6位', trigger: 'blur' }
      //     ]
      // }
    }
  }
}
</script>
<style>
  .title{
    padding-bottom: 10px;
    margin-bottom: 20px;
    border-bottom: 1px solid #ccc;
    font-size:30px;
    font-family: "Helvetica Neue",Helvetica,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","微软雅黑",Arial,sans-serif;
  }
</style>
